<style lang="scss" scoped>
	@import '@/assets/css/variable';

	.search {
		// position: absolute;
		// top: 0;
		// bottom: $tabbar-height;
		width: 100%;
		background-color: $bgw;
		min-height: 100%;
		font-size: 1.2rem;
		overflow-y: scroll;
		box-sizing: border-box;
		flex:1;
		background-color: $main-bgc-white;
		
	}
</style>
<template>
	<div class="search">
		<div>
			<van-search
			  v-model="value"
			  show-action
			  placeholder="请输入想要搜索的资讯"
			  @search="onSearch"
			>
			  <template #action>
			    <div @click="onSearch">搜索</div>
			  </template>
			</van-search>
		</div>
		<zixun-list v-if="articleList&&articleList.length>0" :list="articleList"></zixun-list>
		<!-- <div class="list" v-if="coursePageList&&coursePageList.length>0">
			<zixun-list :list="zixunList"></zixun-list>
		</div> -->
		<div v-if="articleList.length<=0" class="no-data color-s padding-all-m">暂无数据</div>
	</div>
</template>

<script>
	// @ is an alias to /src
	import zixunList from '@/components/zixunList.vue'
	import SearchBox from '@/components/SearchBox.vue'
	import {
		myMixins
	} from "@/assets/js/mixins.js"
	export default {
		name: "search",
		mixins: [myMixins],
		components: {
			zixunList,SearchBox
		},
		// watch:{
		// 	tabActive(newVal) {
		// 		console.log("newVal",newVal)
		// 	}
		// },
		data() {
			return {
				articleList:'',
				value:'',
				finished:false
			}
		},
		created() {
			const _this = this;
			// this.getCode()
		},
		// destroyed() {
		// 	this.$router.replace('/home')
		// },
		mounted() {
			// document.title = '活动管理'
			// this.courseData = this.$store.state.courseData
			
			// var arr = document.getElementsByClassName("tabBox");
			// window.onscroll = function() {
			// 	//为了保证兼容性，这里取两个值，哪个有值取哪一个
			// 	//scrollTop就是触发滚轮事件时滚轮的高度
			// 	var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
			// 	if (scrollTop > 120) {
			// 		arr[0].classList.add("navbarwrap");
			// 	} else {
			// 		arr[0].classList.remove("navbarwrap");
			// 	}
			// }
		},
		// destroyed() {
		// 	var arr = document.getElementsByClassName("tabBox");
		// 	window.onscroll = function() {}
		// },
		methods: {
			toDetailView(item) {
				console.log(item)
				if(item.type==2){
					this.$router.push(`/course/detail4xx?id=${item.id}&type=${item.type}&fromView=s`)
				}else{
					this.$router.push(`/course/detail4xs?id=${item.id}&type=${item.type}&fromView=s`)
				}
			},
			onSearch() {
				console.log("onSearch",this.value)
				this.ArticleH5Artpage(this.value)
			},
			onClickLabels(index) {
				this.activeLabel = index
				console.log("onClickLabels", index)
			},
			ArticleH5Artpage(val) {
				const _this = this;
				let params = {
					name:val,
					campus_id: JSON.parse(localStorage.getItem('selectedCampus')).id,
				}
				_this.$request.ArticleH5Artpage(params).then(res => {
					_this.articleList = res.data.data
					// this.carousel = res.data.data
					// this.$store.commit('setCaseList', this.caseList);
				})
			},
		}
	};
</script>
